<template>
<x-main>
  <view class="x-full-container x-store">
    <x-empty :show="$emptyArray(storeList)"></x-empty>
    <view @click="onModify(item)" class="body" v-for="(item, index) in storeList">
      <view class="x-space-between x-small-bottom">
        <view class="name">{{item.storeName}}</view>
        <view v-if="item.status == 1" class="enabled">启用</view>
        <view v-if="item.status == 0" class="disabled">禁用</view>
      </view>
      <view class="value x-small-bottom">售后电话：{{item.customerServiceNumber}}</view>
      <view class="value x-small-bottom">门店地址：{{item.storeAddress}}</view>
<!--      <view class="x-row">-->
<!--        <view class="value x-small-right">门店账号数：3</view>-->
<!--        <view class="value">售后电话：15959234092</view>-->
<!--      </view>-->
    </view>
  </view>
</x-main>
  <x-bottom>
    <view @click="onAdd" class="x-btn x-btn-primary">添加门店</view>
  </x-bottom>
</template>

<script setup>
import store from '@/stores/modules/store';
import {storeToRefs} from "pinia";
import {onLoad, onShow} from "@dcloudio/uni-app";
const Store  = store();
const {storeList} = storeToRefs(Store);

onShow(async () => {
  await Store.getList();
})

const onAdd = () => {
  uni.navigateTo({url: "/pages/mine/store/form"});
}

const onModify = (item) => {
  uni.navigateTo({url: "/pages/mine/store/form?id=" + item.storeId});
}
</script>

<style scoped lang="less">
.x-store {
  .body {
    background-color: #ffffff;
    padding: 20rpx;
    box-sizing: border-box;
    border-radius: 10rpx;
    margin-bottom: 20rpx;

    .name {
      font-size: 32rpx;
      font-weight: bold;
    }

    .value {
      font-size: 24rpx;
      color: #999999;
    }

    .enabled {
      color: @success;
      background-color: #f2f2f2;
      font-size: 24rpx;
      width: 100rpx;
      height: 44rpx;
      box-sizing: border-box;
      text-align: center;
      line-height: 44rpx;
    }

    .disabled {
      font-size: 24rpx;
      color: @danger;
      background-color: #f2f2f2;
      width: 100rpx;
      height: 44rpx;
      box-sizing: border-box;
      text-align: center;
      line-height: 44rpx;
    }
  }
}
</style>
